<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Tree Context Menu - jQuery EasyUI Demo</title>
    <%@ include file="/WEB-INF/inc/default.jsp"%>
    <jsp:include page="/WEB-INF/inc/dic.jsp"/>

</head>
<body>
    <h2>Tree Context Menu</h2>
    <div class="demo-info">
        <div class="demo-tip icon-tip"></div>
        <div>Right click on a node to display context menu.</div>
    </div>
    <div style="margin:10px 0;">
    </div>
    <ul id="tt" class="easyui-tree" data-options="
            url: '/customer/company/companyorg.do?companyId=1',
            animate: true,
            onContextMenu: function(e,node){
                e.preventDefault();
                $(this).tree('select',node.target);
                $('#mm').menu('show',{
                    left: e.pageX,
                    top: e.pageY
                });
            }
        "></ul>
    <div id="mm" class="easyui-menu" style="width:120px;">
        <div onclick="append()" data-options="iconCls:'icon-add'">Append</div>
        <div onclick="removeit()" data-options="iconCls:'icon-remove'">Remove</div>
        <div class="menu-sep"></div>
        <div onclick="expand()">Expand</div>
        <div onclick="collapse()">Collapse</div>
    </div>
    <script type="text/javascript">
        function append(){
            var t = $('#tt');
            var node = t.tree('getSelected');
            t.tree('append', {
                parent: (node?node.target:null),
                data: [{
                    text: 'new item1'
                },{
                    text: 'new item2'
                }]
            });
        }
        function removeit(){
            var node = $('#tt').tree('getSelected');
            $('#tt').tree('remove', node.target);
        }
        function collapse(){
            var node = $('#tt').tree('getSelected');
            $('#tt').tree('collapse',node.target);
        }
        function expand(){
            var node = $('#tt').tree('getSelected');
            $('#tt').tree('expand',node.target);
        }
    </script>
</body>
</html>